import React from 'react';
import { Editor } from '@tiptap/react';

interface TableButtonProps {
  editor: Editor;
  icon: string;
  title?: string;
}

const TableButton: React.FC<TableButtonProps> = ({
  editor,
  icon,
  title = '插入表格'
}) => {
  const handleAddTable = () => {
    if (editor) {
      editor.chain().focus().insertTable({ 
        rows: 3, 
        cols: 3, 
        withHeaderRow: true 
      }).run();
    }
  };

  return (
    <button
      onClick={handleAddTable}
      className="toolbar-button"
      title={title}
    >
      <i className="icon">{icon}</i>
    </button>
  );
};

export default TableButton;